import { Component,useEffect,useState } from 'react'
import { View, Text,Image,Icon } from '@tarojs/components'
import './index.less'
import Taro from '@tarojs/taro'
import { connect } from 'react-redux'
import { getBlog } from '../../api/blog'

function Mine (props) {
  const [list,setList] = useState([])

  useEffect(()=>{
    getBlog('',props.data.user_id)
      .then(res=>{
        setList(res.data.data)
      })
  },[props.data.creating])

  const getDate = (date) => {
    date = new Date(date)
    return date.getFullYear()+'年'+(date.getMonth()+1)+'月'+date.getDate()+'日'
  }

  return (
    <View className='index'>
      <View className='useInfo'>
        <View>
            <Image src={props.data.user_photo} ></Image>
            <Text>{props.data.nickname}</Text>
        </View>
      </View>
      <View className='blog'>
        <View className='mine'>
          <Icon class="icon-small" type="search" size="18" color="black"></Icon>
          我的博客:
        </View>
          {
            list.length?
            list.map(item => (
              <View className="card" onClick={()=>{Taro.navigateTo({ url: '/pages/detail/index?blog_id='+item.blog_id })}}>
                <View className='title'>{item.title}</View>
                <View className='content'>{item.content}</View>
                <View className='info'>博客 | {item.user_data?item.user_data[0].nickname:''} {getDate(item.time)}</View>
              </View>
            )):
            (
              <View className='toCreate' onClick={()=>{Taro.switchTab({ url: '/pages/create/index'})}}>
                还没有博客,<Text>点击前往创作</Text>
              </View>
            )
          }
      </View>
    </View>
  )
}

const hoc = connect(({ login }) => ({
  data:login
}))

export default hoc(Mine)